<template>
  <el-dialog :visible.sync="dialogVisible"
             :close-on-click-modal="false"
             :modal-append-to-body="false"
             width="70%"
             top="7vh"
             custom-class="summary"
             :before-close="handleClose">
   <span slot="title" class="summary-title">
     <span>{{title}}</span>
   </span>
   <el-row class="summary-form">
     <el-form :model="summaryForm" label-width="110px" :rules="summaryFormRule" ref="summaryForm" :disabled="formDisable">
       <el-row>
         <el-col :span="6">
           <el-form-item label="信息录入员" prop="inputName">
             <el-input v-model="summaryForm.inputName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="成交人姓名" prop="dealName">
             <el-input class="w100" v-model="summaryForm.dealName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="公司名字" prop="companyName">
             <el-input class="w100" v-model="summaryForm.companyName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="公司类型" prop="companyType">
             <el-select v-model="summaryForm.companyType" class="w100">
               <el-option
                 v-for="item in codelist.companyType"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="6">
           <el-form-item label="注册地址" prop="registAddress">
             <!--<el-input v-model="summaryForm.registAddress"></el-input>-->
             <el-select v-model="summaryForm.registAddress" class="w100">
               <el-option
                 v-for="item in codelist.registerAddress"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="成立日期" prop="resgitDate">
             <el-date-picker class="w100" @change="onRegistDate" v-model="summaryForm.registDate" format="yyyy-MM-dd" value-format="yyyy-MM-dd"></el-date-picker>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="年限" prop="years">
             <el-input v-model="summaryForm.years" disabled></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="银行状态" prop="bankState">
             <!--<el-input v-if="formDisable" class="w100" v-model="summaryForm.bankState" format="yyyy-MM-dd" value-format="yyyy-MM-dd"></el-input>-->
             <el-select v-model="summaryForm.bankState" class="w100">
               <el-option
                 v-for="item in codelist.bank_state"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="8">
           <el-form-item label="法人姓名" prop="corporationName">
             <el-input v-model="summaryForm.corporationName"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="信用代码" prop="creditCode">
             <el-input class="w100" v-model="summaryForm.creditCode" :disabled="operFlag === 'update'"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="注册资金/万" prop="registMoney">
             <el-input class="w100" v-model="summaryForm.registMoney"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="8">
           <el-form-item label="网银状态" prop="cyberState">
             <el-select v-model="summaryForm.cyberState" class="w100">
               <el-option
                 v-for="item in codelist.cyber_bank_state"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
             <!--<el-input v-model="summaryForm.cyberState"></el-input>-->
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="收购价格" prop="buyPrice">
             <el-input v-model="summaryForm.buyPrice"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="收购日期" prop="buyDate">
             <el-date-picker class="w100" v-model="summaryForm.buyDate" format="yyyy-MM-dd" value-format="yyyy-MM-dd"></el-date-picker>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="8">
           <el-form-item label="预售价格" prop="advancePrice">
             <el-input v-model="summaryForm.advancePrice"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="成交价格" prop="dealPrice">
             <el-input v-model="summaryForm.dealPrice"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="个税密码" prop="ptaxPwd">
             <el-input v-model="summaryForm.ptaxPwd"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="8">
           <el-form-item label="销售状态" prop="saleState">
             <!--<el-input v-model="summaryForm.saleState"></el-input>-->
             <el-select v-model="summaryForm.saleState" class="w100">
               <el-option
                 v-for="item in codelist.sales_state"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="国地税密码" prop="taxPwd">
             <el-input v-model="summaryForm.taxPwd"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="发票类型" prop="invoiceType">
             <!--<el-input v-model="summaryForm.invoiceType"></el-input>-->
             <el-select v-model="summaryForm.invoiceType" class="w100">
               <el-option
                 v-for="item in codelist.bill_type"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="8">
           <el-form-item label="变更状态" prop="changeState">
             <!--<el-input v-model="summaryForm.changeState"></el-input>-->
             <el-select v-model="summaryForm.changeState" class="w100">
               <el-option
                 v-for="item in codelist.change_state"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="企业税务等级" prop="taxLeval">
             <!--<el-input v-model="summaryForm.taxLeval"></el-input>-->
             <el-select v-model="summaryForm.taxLeval" class="w100">
               <el-option
                 v-for="item in codelist.tax_grade"
                 :key="item.codeText"
                 :label="item.codeText"
                 :value="item.codeText">
               </el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="份数" prop="taxNum">
             <el-input v-model="summaryForm.taxNum"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row v-if="userObj.username==='admin'||userObj.username===summaryForm.inputName||userObj.username===summaryForm.dealName || userObj.root===1">
         <el-col :span="12">
           <el-form-item label="卖家信息" prop="seller">
             <el-input type="textarea" v-model="summaryForm.seller"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="买家信息" prop="buyer">
             <el-input type="textarea" v-model="summaryForm.buyer"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-form-item label="备注" prop="remark">
           <el-input type="textarea" v-model="summaryForm.remark"></el-input>
         </el-form-item>
       </el-row>
       <el-row>
         <el-form-item label="资料详单" prop="remark">
           <el-input type="textarea" v-model="summaryForm.informationList"></el-input>
         </el-form-item>
       </el-row>
     </el-form>
   </el-row>
    <el-row slot="footer" class="summary-foot">
      <el-button @click="handleClose">取 消</el-button>
      <el-button type="primary" @click="confirm('summaryForm')">确定</el-button>
    </el-row>
  </el-dialog>
</template>

<script>
import api from '../api';

export default {
  name: 'summary-form',
  props: {
    visible: Boolean,
    title: String,
    form: Object,
    formDisable: Boolean,
    operFlag: String,
    userObj: Object
  },
  data() {
    const validateCode = (rule, value, callback) => {
      const val = value.trim();
      const regStr = /^[A-Za-z0-9]+$/; // 只能是字母或者数字
      if (!val) {
        callback(new Error('信用代码不能为空！'));
      } else if (val.match(regStr) && val.length === 18) {
        callback();
      }
      callback(new Error('信用代码格式不正确！'));
    };
    const validateTaxPwd = (rule, value, callback) => {
      const regStr = /^[^\u4e00-\u9fa5]+$/; // 不能为中文
      if (!value || value.match(regStr)) {
        callback();
      }
      callback(new Error('国地税密码不能含有中文！'));
    };
    const validatepTaxPwd = (rule, value, callback) => {
      const regStr = /^[^\u4e00-\u9fa5]+$/; // 不能为中文
      if (!value || value.match(regStr)) {
        callback();
      }
      callback(new Error('国地税密码不能含有中文！'));
    };
    const validateTaxNum = (rule, value, callback) => {
      const regStr = /^[1-9]\d*$/; // 只能为正整数
      if (!value || value.match(regStr)) {
        callback();
      }
      callback(new Error('份数需为正整数！'));
    };
    const validateBuyer = (rule, value, callback) => {
      if (!value) {
        callback(new Error('买家信息不能为空！'));
      } else if (value.length > 500) {
        callback(new Error('买家信息不能超过500个字！'));
      }
      callback();
    };
    const validateSeller = (rule, value, callback) => {
      if (!value) {
        callback(new Error('买家信息不能为空！'));
      } else if (value.length > 500) {
        callback(new Error('买家信息不能超过500个字！'));
      }
      callback();
    };
    return {
      summaryForm: JSON.parse(JSON.stringify(this.form)),
      summaryFormRule: {
        inputName: [
          { required: true, message: '信息录入员不能为空', trigger: 'change' }
        ],
        dealName: [
          // { required: true, message: '成交人不能为空', trigger: 'change' }
        ],
        companyName: [
          { required: true, message: '公司名字不能为空', trigger: 'change' }
        ],
        companyType: [
          { required: true, message: '公司类型不能为空', trigger: 'change' }
        ],
        corporationName: [
          { required: true, message: '法人姓名不能为空', trigger: 'change' }
        ],
        creditCode: [
          // { required: true, message: '信用代码不能为空', trigger: 'change' },
          { required: true, validator: validateCode, trigger: 'blur' }
        ],
        registMoney: [
          { required: true, message: '注册资金不能为空', trigger: 'change' }
        ],
        registAddress: [
          { required: true, message: '注册地址不能为空', trigger: 'change' }
        ],
        registDate: [
          { required: true, message: '成交日期不能为空', trigger: 'change' }
        ],
        years: [
          { required: true, message: '年限不能为空', trigger: 'change' }
        ],
        bankState: [
          { required: true, message: '银行状态不能为空', trigger: 'change' }
        ],
        cyberState: [
          { required: true, message: '网银状态不能为空', trigger: 'change' }
        ],
        buyPrice: [
          { required: true, message: '收购价格不能为空', trigger: 'change' }
        ],
        buyDate: [
          { required: true, message: '收购日期不能为空', trigger: 'change' }
        ],
        advancePrice: [
          { required: true, message: '预售价格不能为空', trigger: 'change' }
        ],
        dealPrice: [
          { required: true, message: '成交价格不能为空', trigger: 'change' }
        ],
        buyer: [
          { required: true, validator: validateBuyer, trigger: 'change' }
        ],
        seller: [
          { required: true, validator: validateSeller, trigger: 'change' }
        ],
        taxPwd: [
          { validator: validateTaxPwd, trigger: 'blur' }
        ],
        invoiceType: [
          // { required: true, message: '发票类型不能为空', trigger: 'change' }
        ],
        taxLeval: [
          // { required: true, message: '企业税务等级不能为空', trigger: 'change' }
        ],
        taxNum: [
          { validator: validateTaxNum, trigger: 'blur' }
        ],
        ptaxPwd: [
          { validator: validatepTaxPwd, trigger: 'blur' }
        ],
        saleState: [
          { required: true, message: '销售状态不能为空', trigger: 'change' }
        ],
        changeState: [
          { required: true, message: '变更状态不能为空', trigger: 'change' }
        ]
      },
      codelist: {
        bank_state: [],
        bill_type: [],
        change_state: [],
        cyber_bank_state: [],
        sales_state: [],
        tax_grade: [],
        registerAddress: [],
        companyType: []
      }
    };
  },
  created() {
    this.initCodeList();
  },
  computed: {
    dialogVisible: {
      get() {
        return this.visible;
      },
      set(value) {
        this.$emit('update:visible', value);
      }
    }
  },
  methods: {
    initCodeList() {
      api.getCodeList().then((data) => {
        data.forEach((codelist) => {
          this.codelist[codelist.codeType] = codelist.codelists;
        });
      });
    },
    onRegistDate(val) {
      if (!val) {
        this.summaryForm.years = '';
        return;
      }
      const curYear = new Date().getFullYear();
      const registYear = new Date(val).getFullYear();
      this.summaryForm.years = curYear - registYear;
    },
    handleClose() {
      if (this.operFlag !== 'look') {
        this.$emit('dialogClose');
      }
      this.dialogVisible = false;
    },
    confirm(formName) {
      if (this.operFlag === 'look') {
        this.dialogVisible = false;
        return;
      }
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.operFlag === 'add') {
            api.addSummary(this.summaryForm).then((data) => {
              const type = data.flag ? 'success' : 'warning';
              this.$message({
                type,
                message: data.message
              });
              if (type) {
                this.handleClose();
              }
            });
          } else if (this.operFlag === 'update') {
            api.updateSummary(this.summaryForm).then((data) => {
              this.$message({
                type: 'success',
                message: data.message
              });
              this.handleClose();
            });
          }
        } else {
          this.$message({
            type: 'warning',
            message: '填写信息有误，请仔细检查！'
          });
          return false;
        }
      });
    }
  }
};
</script>

<style scoped lang="scss">
  /deep/ .summary {
    margin: 0 15% 50px;
    overflow-y: auto;
    height: 90%;
    .el-dialog__header {
      background-color: #249ce2;
    }
    &-title {
      color: white;
      font-size: 16px;
    }
    &-foot {
      margin-top: -30px;
      text-align: center;
    }
  }
</style>
